<template>
  <div class="container">
    <video :src="video" controls></video>
    <div class="content_wrapper">
      <div class="label">课程介绍</div>
      <div class="desc">{{ '&nbsp;&nbsp;&nbsp;&nbsp;' + description }}</div>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        video: '',
        description: '',
      };
    },
    methods: {
    },
    mounted() {
      const {
        video,
        description,
      } = JSON.parse(this.$mp.query.info);
      this.video = video;
      this.description = description;
    },
    onUnload() {
      // 退出页面的时候清理数据
      Object.assign(this.$data, this.$options.data());
    },
  };
</script>

<style scoped lang="less">
  .container {
    video {
      width: 100vw;
      height: 75vw;
    }
    .content_wrapper {
      padding: 0 12px;
      .label {
        padding: 10px 0;
        font-weight: bold;
      }
      .desc {
        margin-top: 5px;
        font-size: 16px;
        color: #333333;
      }
    }
  }
</style>
